<!DOCTYPE html>
<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
    <%@taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c" %> 
 <%@taglib uri="http://java.sun.com/jsp/jstl/fmt" prefix="fmt" %>
  <%@ taglib prefix="fn" uri="http://java.sun.com/jsp/jstl/functions" %> 
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0, user-scalable=0, minimum-scale=1.0, maximum-scale=1.0">
<meta name="apple-mobile-web-app-capable" content="yes">
<meta name="apple-mobile-web-app-status-bar-style" content="black">
<title>加油记录</title>
	<link rel="stylesheet" href="${pageContext.request.contextPath}/css/weui.css"/>
	<link rel="stylesheet" href="${pageContext.request.contextPath}/css/wechat.css"/>
	<link rel="stylesheet" href="${pageContext.request.contextPath}/css/iScroll.css"/>

	 
</head>
<body>
	<input type="hidden" id="rowCount" value="${pageView.rowCount }">
	<div id="wrapper">
		<div id="scroller">
			<div id="pullDown" >
				<span class="pullDownIcon"></span><span class="pullDownLabel">下拉刷新...</span>
			</div>
			<ul id="thelist"></ul>
			<div id="pullUp">
				<span class="pullUpIcon"></span><span class="pullUpLabel">上拉加载下页...</span>
			</div>
		</div>
	</div>
	<div  class="footer">
		<span>本服务由</span>
	    <img src="${pageContext.request.contextPath}/images/logo.png" title="油掌柜" />
	    <span>提供技术支持</span>
	</div>
	<script type="text/javascript" src="${pageContext.request.contextPath}/js/iscroll.js"></script>
	<script type="text/javascript" src="${pageContext.request.contextPath}/js/iscroll_show.js"></script>
	 <script src="${pageContext.request.contextPath}/js/zepto.min.js"></script>
	<script type="text/javascript">
	$(function(){
		pullDownAction();
	});
		
		var pageSize=2,rowCount,
		generatedCount = 1;
	
		function pullDownAction () {
  			$.ajax({
		  	      type: "POST",
		  	      url: "${pageContext.request.contextPath}/fuellingData/list",
		  	      data: {pageNo:1,pageSize:pageSize},
		  	      success: function(data){
		  	    	var result = '';
		  	    	  if(data.code == 200){
		  	    		generatedCount = 1;
	  	    			rowCount = data.rowCount;
	  	    			if(data.records.length<=0){
	  	    				$("#pullDown").hide();
	  	    				$("#pullUp").hide();
			  	    		$("#thelist").html("<li id=\"no_date_li\" style=\"text-align: center;\">"+
			              	 "<div class=\"weui_cell\" id=\"fuelling_div\" style=\"text-align: center;\">当前无数据</div></li>");
	  	    			}else{
			  	    		$("#thelist").html("");
	  	    			}
		  	    		$.each(data.records, function(name, value) {
		  	    			result = "<li><div class=\"weui_cell\" id=\"fuelling_div\">"+
			                     "<div class=\"weui_cell_bd weui_cell_primary\">"+
			                         "<p>"+this.stationName+" <span class=\"record-info\">"+this.prName+
			                         "<span class=\"record-price\">"+this.receivableAmount+
			                         "</span>（实付"+this.realincomeAmount+"）</span>"+
			                         "</p>"+
			                     "</div>"+
			                     "<div class=\"weui_cell_ft\">"+
			                        " <p class=\"small-font\">"+this.createdTime+
			                          "<span class=\"display-block\">"+paidType(this.paidTypeId)+
			                          "</span>"+
			                         "</p>"+
			                     "</div>"+
		                 	"</div></li>";
		  	    			
			  	    		$("#thelist").append(result);
			  	    		myScroll.refresh();
		  	    		});
		  	    	  }else{
			  	        alert("加油站列表加载失败！");
		  	    	  }
		  	      }
		  	   });
		};
		
		function pullUpAction () {
			$.ajax({
		  	      type: "POST",
		  	      url: "${pageContext.request.contextPath}/fuellingData/list",
		  	      data: {pageNo:(++generatedCount),pageSize:pageSize},
		  	      success: function(data){
		  	    	var result = '';
		  	    	  if(data.code == 200){
	  	    			rowCount = data.rowCount;
		  	    		$.each(data.records, function(name, value) {
		  	    			result = "<li><div class=\"weui_cell\" id=\"fuelling_div\">"+
			                     "<div class=\"weui_cell_bd weui_cell_primary\">"+
			                         "<p>"+this.stationName+" <span class=\"record-info\">"+this.prName+
			                         "<span class=\"record-price\">"+this.receivableAmount+
			                         "</span>（实付"+this.realincomeAmount+"）</span>"+
			                         "</p>"+
			                     "</div>"+
			                     "<div class=\"weui_cell_ft\">"+
			                        " <p class=\"small-font\">"+this.createdTime+
			                          "<span class=\"display-block\">"+paidType(this.paidTypeId)+
			                          "</span>"+
			                         "</p>"+
			                     "</div>"+
		                 	"</div></li>";
		  	    			
			  	    		$("#thelist").append(result);
			  	    		myScroll.refresh();
		  	    		});
		  	    	  }else{
			  	        alert("加油站列表加载失败！");
		  	    	  }
		  	      }
		  	   });
		};
		function paidType(paidTypeId){
			var paidType;
  			if(paidTypeId == -1){
  				paidType = "无需支付";
  			}else if(paidTypeId == 0 ){
  				paidType = "待确定";
  			}else if(paidTypeId == 1){
  				paidType = "现金";
  			}else if(paidTypeId == 2){
  				paidType = "余额支付";
  			}else if(paidTypeId == 3){
  				paidType = "支付宝";
  			}else if(paidTypeId == 4){
  				paidType = "微信";
  			}
  			return paidType;
		}
	</script>
</body>
</html>